﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="article_list.aspx.cs" Inherits="HX.Admin.article_list" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <link rel="stylesheet" href="style/style.css" type="text/css" media="screen" />
    <link rel="stylesheet" href="style/iframe.css" type="text/css" media="screen" />
    <script type="text/javascript" src="scripts/jquery-1.3.2.min.js"></script>
    <script type="text/javascript" src="scripts/jquery.configuration.js"></script>
</head>
<body>
    <div id="main-content">
        <div class="content-box">
            <div class="content-box-header">
                <h3>Content box</h3>
                <ul class="content-box-tabs">
                    <li><a href="#tab1" class="default-tab">Table</a></li>
                    <li><a href="#tab2">Forms</a></li>
                </ul>
                <div class="clear"></div>
            </div>

            <div class="content-box-content">
                <div class="tab-content default-tab" id="tab1">
                    <div class="notification attention">
                        <a href="javascript:;" class="close"><img src="style/images/icons/cross_grey_small.png" title="" alt="close" /></a>
                        <div>
                            This is a Content Box. You can put whatever you want in it. By the way, you can
                            close this notification with the top-right cross.
                        </div>
                    </div>
                    <table>
                        <thead>
                            <tr>
                                <th><input class="check-all" type="checkbox" /></th>
                                <th>Column 1</th>
                                <th>Column 2</th>
                                <th>Column 3</th>
                                <th>Column 4</th>
                                <th>Column 5</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td><input type="checkbox" /></td>
                                <td>Lorem ipsum dolor</td>
                                <td><a href="#" title="title">Sit amet</a></td>
                                <td>Consectetur adipiscing</td>
                                <td>Donec tortor diam</td>
                                <td>
                                    <a href="#" title=""><img src="style/images/icons/pencil.png" alt="" /></a>
                                    <a href="#" title=""><img src="style/images/icons/cross.png" alt="" /></a>
                                    <a href="#" title=""><img src="style/images/icons/hammer_screwdriver.png" alt="" /></a>
                                </td>
                            </tr>
                            <tr>
                                <td><input type="checkbox" /></td>
                                <td>Lorem ipsum dolor</td>
                                <td><a href="#" title="title">Sit amet</a></td>
                                <td>adipiscing</td>
                                <td>Donec tortor diam</td>
                                <td>
                                    <a href="#" title=""><img src="style/images/icons/pencil.png" alt="" /></a>
                                    <a href="#" title=""><img src="style/images/icons/cross.png" alt="" /></a>
                                    <a href="#" title=""><img src="style/images/icons/hammer_screwdriver.png" alt="" /></a>
                                </td>
                            </tr>
                            <tr>
                                <td><input type="checkbox" /></td>
                                <td>Lorem ipsum dolor</td>
                                <td><a href="#" title="title">Sit amet</a></td>
                                <td>Consectetur adipiscing</td>
                                <td>Donec tortor diam</td>
                                <td>
                                    <a href="#" title=""><img src="style/images/icons/pencil.png" alt="" /></a>
                                    <a href="#" title=""><img src="style/images/icons/cross.png" alt="" /></a>
                                    <a href="#" title=""><img src="style/images/icons/hammer_screwdriver.png" alt="" /></a>
                                </td>
                            </tr>
                            <tr>
                                <td><input type="checkbox" /></td>
                                <td>Lorem ipsum dolor</td>
                                <td><a href="#" title="title">Sit amet</a></td>
                                <td>adipiscing</td>
                                <td>Donec tortor diam</td>
                                <td>
                                    <a href="#" title=""><img src="style/images/icons/pencil.png" alt="" /></a>
                                    <a href="#" title=""><img src="style/images/icons/cross.png" alt="" /></a>
                                    <a href="#" title=""><img src="style/images/icons/hammer_screwdriver.png" alt="" /></a>
                                </td>
                            </tr>
                            <tr>
                                <td><input type="checkbox" /></td>
                                <td>Lorem ipsum dolor</td>
                                <td><a href="#" title="title">Sit amet</a></td>
                                <td>Consectetur adipiscing</td>
                                <td>Donec tortor diam</td>
                                <td>
                                    <a href="#" title=""><img src="style/images/icons/pencil.png" alt="" /></a>
                                    <a href="#" title=""><img src="style/images/icons/cross.png" alt="" /></a>
                                    <a href="#" title=""><img src="style/images/icons/hammer_screwdriver.png" alt="" /></a>
                                </td>
                            </tr>
                            <tr>
                                <td><input type="checkbox" /></td>
                                <td>Lorem ipsum dolor</td>
                                <td><a href="#" title="title">Sit amet</a></td>
                                <td>adipiscing</td>
                                <td>Donec tortor diam</td>
                                <td>
                                    <a href="#" title=""><img src="style/images/icons/pencil.png" alt="" /></a>
                                    <a href="#" title=""><img src="style/images/icons/cross.png" alt="" /></a>
                                    <a href="#" title=""><img src="style/images/icons/hammer_screwdriver.png" alt="" /></a>
                                </td>
                            </tr>
                            <tr>
                                <td><input type="checkbox" /></td>
                                <td>Lorem ipsum dolor</td>
                                <td><a href="#" title="title">Sit amet</a></td>
                                <td>Consectetur adipiscing</td>
                                <td>Donec tortor diam</td>
                                <td>
                                    <a href="#" title=""><img src="style/images/icons/pencil.png" alt="" /></a>
                                    <a href="#" title=""><img src="style/images/icons/cross.png" alt="" /></a>
                                    <a href="#" title=""><img src="style/images/icons/hammer_screwdriver.png" alt="" /></a>
                                </td>
                            </tr>
                            <tr>
                                <td><input type="checkbox" /></td>
                                <td>Lorem ipsum dolor</td>
                                <td><a href="#" title="title">Sit amet</a></td>
                                <td>adipiscing</td>
                                <td>Donec tortor diam</td>
                                <td>
                                    <a href="#" title=""><img src="style/images/icons/pencil.png" alt="" /></a>
                                    <a href="#" title=""><img src="style/images/icons/cross.png" alt="" /></a>
                                    <a href="#" title=""><img src="style/images/icons/hammer_screwdriver.png" alt="" /></a>
                                </td>
                            </tr>
                            <tr>
                                <td><input type="checkbox" /></td>
                                <td>Lorem ipsum dolor</td>
                                <td><a href="#" title="title">Sit amet</a></td>
                                <td>Consectetur adipiscing</td>
                                <td>Donec tortor diam</td>
                                <td>
                                    <a href="#" title=""><img src="style/images/icons/pencil.png" alt="" /></a>
                                    <a href="#" title=""><img src="style/images/icons/cross.png" alt="" /></a>
                                    <a href="#" title=""><img src="style/images/icons/hammer_screwdriver.png" alt="" /></a>
                                </td>
                            </tr>
                            <tr>
                                <td><input type="checkbox" /></td>
                                <td>Lorem ipsum dolor</td>
                                <td><a href="#" title="title">Sit amet</a></td>
                                <td>adipiscing</td>
                                <td>Donec tortor diam</td>
                                <td>
                                    <a href="#" title=""><img src="style/images/icons/pencil.png" alt="" /></a>
                                    <a href="#" title=""><img src="style/images/icons/cross.png" alt="" /></a>
                                    <a href="#" title=""><img src="style/images/icons/hammer_screwdriver.png" alt="" /></a>
                                </td>
                            </tr>
                        </tbody>
                        <tfoot>
                            <tr>
                                <td colspan="6">
                                    <div class="bulk-actions align-left">
                                    </div>
                                    <div class="bulk-actions align-left">
                                        <select name="dropdown">
                                            <option value="option1">Choose an action...</option>
                                            <option value="option2">Edit</option>
                                            <option value="option3">Delete</option>
                                        </select>
                                        <a class="button" href="#">Apply to selected</a>
                                    </div>
                                    <div class="pagination">
                                        <a href="#" class="disable">第一页</a><a href="#">上一页</a>
                                        <a href="#">1</a> <a href="#">2</a> <a href="#" class="current">3</a> <a href="#">4</a>
                                        <a href="#">下一页</a><a href="#">最后页</a>
                                    </div>
                                    <div class="clear"></div>
                                </td>
                            </tr>
                        </tfoot>
                    </table>
                </div>

                <div class="tab-content" id="tab2">
                    <form action="#" method="post">
                    <fieldset>
                        <p>
                            <label class="title">Small form input</label>
                            <label><input class="text-input small-input" type="text" id="small-input" name="small-input" /></label>
                            <label class="input-notification success">Successful message</label>
                        </p>
                        <p>
                            <label class="title">Medium form input</label>
                            <label><input class="text-input medium-input datepicker" type="text" id="medium-input" name="medium-input" /></label>
                            <label class="input-notification error png_bg">Error message</label>
                        </p>
                        <p>
                            <label class="title">Large form input</label>
                            <label><input class="text-input large-input" type="text" id="large-input" name="large-input" /></label>
                        </p>
                        <p>
                            <label class="title">Checkboxes</label>
                            <label><input type="checkbox" name="checkbox1" id="checkbox1" /></label><label for="checkbox1">This is a checkbox</label>
                            <label><input type="checkbox" name="checkbox2" id="checkbox2" /></label><label for="checkbox2">And this is another checkbox</label>
                        </p>
                        <p>
                            <label class="title">Radio buttons</label>
                            <label><input type="radio" name="radio1" id="radio1" /></label><label for="radio1">This is a radio button</label>
                            <label><input type="radio" name="radio2" id="radio2" /></label><label for="radio2">This is another radio button</label>
                        </p>
                        <p>
                            <label class="title">This is a drop down list</label>
                            <label><select name="dropdown" class="small-input">
                                <option value="option1">Option 1</option>
                                <option value="option2">Option 2</option>
                                <option value="option3">Option 3</option>
                                <option value="option4">Option 4</option>
                            </select>
                            </label>
                        </p>
                        <p>
                            <label class="title">Textarea with WYSIWYG</label>
                            <label><textarea class="text-input textarea" id="textarea" name="textfield" cols="79" rows="15"></textarea></label>
                        </p>
                        <p>
                            <input class="button" type="submit" value="Submit" />
                        </p>
                    </fieldset>
                    <div class="clear"></div>
                    </form>
                </div>
            </div>
        </div>

        <div class="content-box column-left">
            <div class="content-box-header">
                <h3>Content box left</h3>
            </div>
            <div class="content-box-content">
                <div class="tab-content default-tab">
                    <h4>Maecenas dignissim</h4>
                    <p>
                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed in porta lectus. Maecenas
                        dignissim enim quis ipsum mattis aliquet. Maecenas id velit et elit gravida bibendum.
                        Duis nec rutrum lorem. Donec egestas metus a risus euismod ultricies. Maecenas lacinia
                        orci at neque commodo commodo.
                    </p>
                </div>
            </div>
        </div>
        <div class="content-box column-right closed-box">
            <div class="content-box-header">
                <h3>Content box right</h3>
            </div>
            <div class="content-box-content">
                <div class="tab-content default-tab">
                    <h4>This box is closed by default</h4>
                    <p>
                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed in porta lectus. Maecenas
                        dignissim enim quis ipsum mattis aliquet. Maecenas id velit et elit gravida bibendum.
                        Duis nec rutrum lorem. Donec egestas metus a risus euismod ultricies. Maecenas lacinia
                        orci at neque commodo commodo.
                    </p>
                </div>
            </div>
        </div>
        <div class="clear"></div>
        <div class="notification attention png_bg">
            <a href="#" class="close"><img src="style/images/icons/cross_grey_small.png" alt="" /></a>
            <div>
                Attention notification. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                Proin vulputate, sapien quis fermentum luctus, libero.
            </div>
        </div>
        <div class="notification information png_bg">
            <a href="#" class="close"><img src="style/images/icons/cross_grey_small.png" alt="" /></a>
            <div>
                Information notification. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                Proin vulputate, sapien quis fermentum luctus, libero.
            </div>
        </div>
        <div class="notification success png_bg">
            <a href="#" class="close"><img src="style/images/icons/cross_grey_small.png" alt="" /></a>
            <div>
                Success notification. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin
                vulputate, sapien quis fermentum luctus, libero.
            </div>
        </div>
        <div class="notification error png_bg">
            <a href="#" class="close"><img src="style/images/icons/cross_grey_small.png" alt="" /></a>
            <div>
                Error notification. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin
                vulputate, sapien quis fermentum luctus, libero.
            </div>
        </div>
        <div id="footer">
            <pre>&#169; Copyright 2010 华鑫信息科技有限公司 | Powered by <a>dotnet</a>  | <a href="javascript:window.scrollTo(0,0)">TOP</a> </pre>
        </div>
    </div>
</body>
</html>
